﻿<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>启明星招新后台管理</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- basic styles -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet" />
<link rel="stylesheet" href="assets/css/font-awesome.min.css" />


<link rel="stylesheet" href="assets/css/ace.min.css" />
<link rel="stylesheet" href="assets/css/ace-rtl.min.css" />
<link rel="stylesheet" href="assets/css/ace-skins.min.css" />


<script src="assets/js/ace-extra.min.js"></script>

</head>

<body>
	<div class="navbar navbar-default" id="navbar">
		<script type="text/javascript">
            try {
                ace.settings.check('navbar', 'fixed')
            } catch (e) {
            }
        </script>

		<div class="navbar-container" id="navbar-container">
			<div class="navbar-header pull-left">
				<a href="#" class="navbar-brand"> <small> <i
						class="icon-leaf"></i> 启明星招新后台管理系统
				</small>
				</a>
				<!-- /.brand -->
			</div>
			<!-- /.navbar-header -->

			<div class="navbar-header pull-right" role="navigation">
				<ul class="nav ace-nav">

					<li class="light-blue"><a data-toggle="dropdown" href="#"
						class="dropdown-toggle"> <img class="nav-user-photo"
							src="assets/avatars/user.jpg" alt="Jason's Photo" /> <span
							class="user-info"> <small>Welcome,</small> <%=session.getAttribute("user_name")%>>
						</span> <i class="icon-caret-down"></i>
					</a>

						<ul
							class="user-menu pull-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">

							<li><a href="login.jsp"> <i class="icon-off"></i> Logout
							</a></li>
						</ul></li>
				</ul>
				<!-- /.ace-nav -->
			</div>
			<!-- /.navbar-header -->
		</div>
		<!-- /.container -->
	</div>

	<div class="main-container" id="main-container">
		<script type="text/javascript">
            try {
                ace.settings.check('main-container', 'fixed')
            } catch (e) {
            }
        </script>

		<div class="main-container-inner">
			<a class="menu-toggler" id="menu-toggler" href="#"> <span
				class="menu-text"></span>
			</a>

			<div class="sidebar" id="sidebar">
				<script type="text/javascript">
                    try {
                        ace.settings.check('sidebar', 'fixed')
                    } catch (e) {
                    }
                </script>

				<div class="sidebar-shortcuts" id="sidebar-shortcuts">
					<div class="sidebar-shortcuts-large" id="sidebar-shortcuts-large">
						<button class="btn btn-success">
							<i class="icon-signal"></i>
						</button>

						<button class="btn btn-info">
							<i class="icon-pencil"></i>
						</button>

						<button class="btn btn-warning">
							<i class="icon-group"></i>
						</button>

						<button class="btn btn-danger">
							<i class="icon-cogs"></i>
						</button>
					</div>

					<div class="sidebar-shortcuts-mini" id="sidebar-shortcuts-mini">
						<span class="btn btn-success"></span> <span class="btn btn-info"></span>

						<span class="btn btn-warning"></span> <span class="btn btn-danger"></span>
					</div>
				</div>
				<!-- #sidebar-shortcuts -->

				<ul class="nav nav-list">
					<li class="active"><a href="home.jsp"> <i
							class="icon-dashboard"></i> <span class="menu-text"> 首页 </span>
					</a></li>

					<li class="active open"><a href="#" class="dropdown-toggle">
							<i class="icon-list"></i> <span class="menu-text"> 报名信息 </span> <b
							class="arrow icon-angle-down"></b>
					</a>

						<ul class="submenu">

							<li class="active"><a href="stu_info.jsp"> <i
									class="icon-double-angle-right"></i> 报名信息表
							</a></li>
						</ul></li>
				<!-- /.nav-list -->

				<div class="sidebar-collapse" id="sidebar-collapse">
					<i class="icon-double-angle-left"
						data-icon1="icon-double-angle-left"
						data-icon2="icon-double-angle-right"></i>
				</div>

		<script type="text/javascript">
            try {
                ace.settings.check('sidebar', 'collapsed')
            } catch (e) {
            }
        </script>
	</div>

	<div class="main-content">
		<div class="breadcrumbs" id="breadcrumbs">
			<script type="text/javascript">
                try {
                    ace.settings.check('breadcrumbs', 'fixed')
                } catch (e) {
                }
            </script>

			<ul class="breadcrumb">
				<li><i class="icon-home home-icon"></i> <a href="#">首页</a></li>
				<li class="active">报名信息</li>
			</ul>
			<!-- .breadcrumb -->

			<div class="nav-search" id="nav-search">
				<form class="form-search">
					<span class="input-icon"> <input type="text"
						placeholder="Search ..." class="nav-search-input"
						id="nav-search-input" autocomplete="off" /> <i
						class="icon-search nav-search-icon"></i>
					</span>
				</form>
			</div>
			<!-- #nav-search -->

			<div class="page-content">
				<div class="page-header">
					<h1>
						首页 <small> <i class="icon-double-angle-right"></i> 查看
						</small>
					</h1>
				</div>
				<!-- /.page-header -->
			</div>
		</div>
		<div class="row">
			<div class="col-xs-12">
				<!-- PAGE CONTENT BEGINS -->

				<div class="alert alert-block alert-success">
					<button type="button" class="close" data-dismiss="alert">
						<i class="icon-remove"></i>
					</button>

					<i class="icon-ok green"></i> 欢迎使用 <strong class="green">
						启明星招新后台管理系统 </strong>
				</div>

				<div class="widget-body">
					<div class="widget-main">
						<div id="piechart-placeholder"></div>

						<div class="hr hr8 hr-double"></div>

					</div>
				</div>
				<div class="ace-settings-container" id="ace-settings-container">
					<div class="btn btn-app btn-xs btn-warning ace-settings-btn"
						id="ace-settings-btn">
						<i class="icon-cog bigger-150"></i>
					</div>

					<div class="ace-settings-box" id="ace-settings-box">
						<div>
							<div class="pull-left">
								<select id="skin-colorpicker" class="hide">
									<option data-skin="default" value="#438EB9">#438EB9</option>
									<option data-skin="skin-1" value="#222A2D">#222A2D</option>
									<option data-skin="skin-2" value="#C6487E">#C6487E</option>
									<option data-skin="skin-3" value="#D0D0D0">#D0D0D0</option>
								</select>
							</div>
							<span>&nbsp; 选择皮肤</span>
						</div>
					</div>
				</div>



				<script type="text/javascript">
                    window.jQuery
                            || document
                                    .write("<script src='assets/js/jquery-2.0.3.min.js'>"
                                            + "<"+"script>");
                </script>



				<script type="text/javascript">
                    if ("ontouchend" in document)
                        document
                                .write("<script src='assets/js/jquery.mobile.custom.min.js'>"
                                        + "<"+"script>");
                </script>
				<script src="assets/js/bootstrap.min.js"></script>
				<script src="assets/js/typeahead-bs2.min.js"></script>

				<script src="assets/js/jquery-ui-1.10.3.custom.min.js"></script>
				<script src="assets/js/jquery.ui.touch-punch.min.js"></script>
				<script src="assets/js/jquery.slimscroll.min.js"></script>
				<script src="assets/js/jquery.easy-pie-chart.min.js"></script>
				<script src="assets/js/jquery.sparkline.min.js"></script>
				<script src="assets/js/flot/jquery.flot.min.js"></script>
				<script src="assets/js/flot/jquery.flot.pie.min.js"></script>
				<script src="assets/js/flot/jquery.flot.resize.min.js"></script>

				<!-- ace scripts -->

				<script src="assets/js/ace-elements.min.js"></script>
				<script src="assets/js/ace.min.js"></script>

				<!-- inline scripts related to this page -->

				<script type="text/javascript">
                    jQuery(function($) {
                        $('.easy-pie-chart.percentage')
                                .each(
                                        function() {
                                            var $box = $(this).closest(
                                                    '.infobox');
                                            var barColor = $(this)
                                                    .data('color')
                                                    || (!$box
                                                            .hasClass('infobox-dark') ? $box
                                                            .css('color')
                                                            : 'rgba(255,255,255,0.95)');
                                            var trackColor = barColor == 'rgba(255,255,255,0.95)' ? 'rgba(255,255,255,0.25)'
                                                    : '#E2E2E2';
                                            var size = parseInt($(this).data(
                                                    'size')) || 50;
                                            $(this)
                                                    .easyPieChart(
                                                            {
                                                                barColor : barColor,
                                                                trackColor : trackColor,
                                                                scaleColor : false,
                                                                lineCap : 'butt',
                                                                lineWidth : parseInt(size / 10),
                                                                animate : /msie\s*(8|7|6)/
                                                                        .test(navigator.userAgent
                                                                                .toLowerCase()) ? false
                                                                        : 1000,
                                                                size : size
                                                            });
                                        })

                        $('.sparkline')
                                .each(
                                        function() {
                                            var $box = $(this).closest(
                                                    '.infobox');
                                            var barColor = !$box
                                                    .hasClass('infobox-dark') ? $box
                                                    .css('color')
                                                    : '#FFF';
                                            $(this)
                                                    .sparkline(
                                                            'html',
                                                            {
                                                                tagValuesAttribute : 'data-values',
                                                                type : 'bar',
                                                                barColor : barColor,
                                                                chartRangeMin : $(
                                                                        this)
                                                                        .data(
                                                                                'min') || 0
                                                            });
                                        });

                        var placeholder = $('#piechart-placeholder').css({
                            'width' : '90%',
                            'min-height' : '150px'
                        });
                        var arr = [];
                        $.ajax({
                            url : './ClaCount',
                            type : 'post',
                            datatype : 'json',
                            async: false,
                            success : function(msg) {
                                arr = msg.split(",");

                            }
                        });
                        var data = [ {
                            label : "软件组",
                            data : arr[0],
                            color : "#AF4E96"
                        }, {
                            label : "硬件组",
                            data : arr[1],
                            color : "#2091CF"
                        }, {
                            label : "Web组",
                            data : arr[2],
                            color : "#68BC31"
                        }, ]
                        function drawPieChart(placeholder, data, position) {
                            $.plot(placeholder, data, {
                                series : {
                                    pie : {
                                        show : true,
                                        tilt : 0.8,
                                        highlight : {
                                            opacity : 0.25
                                        },
                                        stroke : {
                                            color : '#fff',
                                            width : 2
                                        },
                                        startAngle : 2
                                    }
                                },
                                legend : {
                                    show : true,
                                    position : position || "ne",
                                    labelBoxBorderColor : null,
                                    margin : [ -30, 15 ]
                                },
                                grid : {
                                    hoverable : true,
                                    clickable : true
                                }
                            })
                        }
                        drawPieChart(placeholder, data);

                        /**
                        we saved the drawing function and the data to redraw with different position later when switching to RTL mode dynamically
                        so that's not needed actually.
                         */
                        placeholder.data('chart', data);
                        placeholder.data('draw', drawPieChart);

                        var $tooltip = $(
                                "<div class='tooltip top in'><div class='tooltip-inner'></div></div>")
                                .hide().appendTo('body');
                        var previousPoint = null;

                        placeholder.on('plothover', function(event, pos, item) {
                            if (item) {
                                if (previousPoint != item.seriesIndex) {
                                    previousPoint = item.seriesIndex;
                                    var tip = item.series['label'] + " : "
                                            + item.series['percent'] + '%' + "(" + "人数 : "  + item.series['data'] + ")";
                                    $tooltip.show().children(0).text(tip);
                                }
                                $tooltip.css({
                                    top : pos.pageY + 10,
                                    left : pos.pageX + 10
                                });
                            } else {
                                $tooltip.hide();
                                previousPoint = null;
                            }

                        });

                        var d1 = [];
                        for (var i = 0; i < Math.PI * 2; i += 0.5) {
                            d1.push([ i, Math.sin(i) ]);
                        }

                        var d2 = [];
                        for (var i = 0; i < Math.PI * 2; i += 0.5) {
                            d2.push([ i, Math.cos(i) ]);
                        }

                        var d3 = [];
                        for (var i = 0; i < Math.PI * 2; i += 0.2) {
                            d3.push([ i, Math.tan(i) ]);
                        }

                        var sales_charts = $('#sales-charts').css({
                            'width' : '100%',
                            'height' : '220px'
                        });
                        $.plot("#sales-charts", [ {
                            label : "Domains",
                            data : d1
                        }, {
                            label : "Hosting",
                            data : d2
                        }, {
                            label : "Services",
                            data : d3
                        } ], {
                            hoverable : true,
                            shadowSize : 0,
                            series : {
                                lines : {
                                    show : true
                                },
                                points : {
                                    show : true
                                }
                            },
                            xaxis : {
                                tickLength : 0
                            },
                            yaxis : {
                                ticks : 10,
                                min : -2,
                                max : 2,
                                tickDecimals : 3
                            },
                            grid : {
                                backgroundColor : {
                                    colors : [ "#fff", "#fff" ]
                                },
                                borderWidth : 1,
                                borderColor : '#555'
                            }
                        });

                        $('#recent-box [data-rel="tooltip"]').tooltip({
                            placement : tooltip_placement
                        });
                        function tooltip_placement(context, source) {
                            var $source = $(source);
                            var $parent = $source.closest('.tab-content')
                            var off1 = $parent.offset();
                            var w1 = $parent.width();

                            var off2 = $source.offset();
                            var w2 = $source.width();

                            if (parseInt(off2.left) < parseInt(off1.left)
                                    + parseInt(w1 / 2))
                                return 'right';
                            return 'left';
                        }

                        $('.dialogs,.comments').slimScroll({
                            height : '300px'
                        });

                        //Android's default browser somehow is confused when tapping on label which will lead to dragging the task
                        //so disable dragging when clicking on label
                        var agent = navigator.userAgent.toLowerCase();
                        if ("ontouchstart" in document
                                && /applewebkit/.test(agent)
                                && /android/.test(agent))
                            $('#tasks').on(
                                    'touchstart',
                                    function(e) {
                                        var li = $(e.target).closest(
                                                '#tasks li');
                                        if (li.length == 0)
                                            return;
                                        var label = li.find('label.inline')
                                                .get(0);
                                        if (label == e.target
                                                || $.contains(label, e.target))
                                            e.stopImmediatePropagation();
                                    });

                        $('#tasks').sortable({
                            opacity : 0.8,
                            revert : true,
                            forceHelperSize : true,
                            placeholder : 'draggable-placeholder',
                            forcePlaceholderSize : true,
                            tolerance : 'pointer',
                            stop : function(event, ui) {//just for Chrome!!!! so that dropdowns on items don't appear below other items after being moved
                                $(ui.item).css('z-index', 'auto');
                            }
                        });
                        $('#tasks').disableSelection();
                        $('#tasks input:checkbox').removeAttr('checked').on(
                                'click',
                                function() {
                                    if (this.checked)
                                        $(this).closest('li').addClass(
                                                'selected');
                                    else
                                        $(this).closest('li').removeClass(
                                                'selected');
                                });

                    })
                </script>
</body>
</html>